<template>
    <div class="dropdownMenu-box">
       <p>正在学的课程</p>
       <van-dropdown-menu>
      <van-dropdown-item v-model="value1" :options="option1" />
      <van-dropdown-item v-model="value2" :options="option2" />
      </van-dropdown-menu>

    

    </div>
    
</template>

<script>
export default {
  name:"DropdownMenu",
  data() {
    return {
      value1: 0,
      value2: 'a',
      option1: [
        { text: '全部课程', value: 0 },
        { text: '未开课', value: 1 },
        { text: '进行中', value: 2 },
        { text: '已结课', value: 3 },
        { text: '已过期', value: 4 },
        
      ],
      option2: [
        { text: '默认排序', value: 'a' },
        { text: '好评排序', value: 'b' },
        { text: '销量排序', value: 'c' },
      ],
    };
  },
};
</script>


<style>
.dropdownMenu-box {
    width: 100%;
    font-size: 18px;
}
  .dropdownMenu-box .van-ellipsis{
      font-size: 18px;
  }
.dropdownMenu-box p{
    width: 100%;
    padding-top: .4rem;
    padding-bottom: .5rem;
    height: .3rem;
    text-align: center;
    line-height: .3rem;
    font-size: 22px;
    font-weight: 600;
}

</style>